<template>
  <van-sticky>
    <div class="nav-box u-flex-bet">
      <van-image
        width="28rem"
        height="28rem"
        :src="require('@/assets/images/taskDetail/back@2x.png')"
        @click="goback()"
      />

      <div class="title">{{ tittle }}</div>

      <van-image
        width="44rem"
        height="44rem"
        :src="require('@/assets/images/taskDetail/icon_home@2x.png')"
        @click="goHome()"
      />
    </div>
  </van-sticky>
</template>
<script>
import Vue from "vue";
import { Sticky } from "vant";
Vue.use(Sticky);
export default {
  name: "header-bar",
  props: {
    tittle: {
      type: String,
      default: true,
    },
  },
  data() {
    return {};
  },
  methods: {
    goback() {
      this.$router.goBack();
    },
    goHome() {
      this.$router.push("home");
    },
  },
};
</script>

<style scoped="scoped" lang="scss">
.nav-box {
  position: relative;
  padding: 20rem 24rem;
  background-color: var(--theme);

  .title {
    font-size: 36rem;
    font-weight: bold;
    color: #fff;
  }
}
</style>
